{% extends "skeleton.html" %}
{% block "title" %}Starfield{% end %}
{% block "head" %}
  <script type="text/javascript" src="/admin/js/tmpl.js"></script>
  <script type="text/javascript" src="/admin/js/time.js"></script>
  <script type="text/javascript" src="/admin/js/sectors.js"></script>
{% end %}
{% block "content" %}
  <h1>Sectors</h1>
  <div>
    <span><a href="javascript:findEmptySector();">Find empty sector</a></span> &bull;
    <span><a href="javascript:expandUniverse();">Expand universe</a></span> &bull;
    <span>
      <input type="text" name="name" id="empire-name" placeholder="Name" style="width: 100px;"> &nbsp;
      <input type="number" name="x" id="empire-sector-x" style="width: 50px;">,
      <input type="number" name="y" id="empire-sector-y" style="width: 50px;">
      <a href="javascript:createEmpire();">Create empire</a>
    </span>
  </div>
  <div id="result"></div>
  <script type="text/html" id="create-empire-tmpl">
    <div>Name: <%= empireName %></div>
    <div>Sector: <%= sectorX %>, <%= sectorY %></div>
    <% if (typeof empire !== "undefined") %>
      <div>Empire: <%= empire.id %> <%= empire.display_name %></div>
    <% end %>
    <h2>Logs</h2>
    <div style="white-space: nowrap;">
      <% for (var i = 0; i < logs.length; i++) %>
        <div><%= logs[i] %></div>
      <% end %>
    </div>
  </script>
{% end %}
